import React, { Component } from 'react';
import {
  AppRegistry,
  StyleSheet,
  Text,
  ScrollView,
  RefreshControl,
  View,
  ListView,
  Image,
  TouchableHighlight,
  TouchableOpacity,
  Dimensions,
  Alert
} from 'react-native';

import Button from 'rn-bootstrap-buttons';
import ViewPager from 'react-native-viewpager';
var RNBleManagerModule = require('./lib/RNBleManagerModule');

var ToolbarAndroid = require('ToolbarAndroid');
var Header = require('./tools/Header');

class Row extends Component {  
  	_onClick(){
  		
//  		Alert.alert("123");
//   		this.props.onClick(this.props.data);  
  	}
  	
  	render(){  
  		var buttonProps = {
	    	onPress: this.props.onPress
	    };
    
    	return (  
        	<View style={styles.row}>
	          	<Text style={styles.text} {...buttonProps}>
	            	{this.props.data.text}  
	          	</Text>  
        	</View>  
    	);  
  	}
}

class BleTest extends Component {  
		constructor(props) {
				super(props);
		
				var ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2});
		
				this.state = {  
      			isRefreshing: false,  
      			loaded: 0,  
      			dataSource: ds.cloneWithRows(["1","2","3"]),
      			listdata:["1","2","3"],
      			rowData: Array.from(new Array(20)).map(  
        			(val, i) => ({text:'初始行 ' + i})),  
    		};  
		}
		
		componetWillUnmount(){
				RNBleManagerModule.destroy();
		}
	
		_onPressButton(rowID){
				Alert.alert(rowID);
		}
	
	 _genRows(){
        const dataBlob = [];
        for(let i = 0 ; i< 200 ; i ++ ){
            dataBlob.push("aa"+i);
        }
        return dataBlob;
    }

    _pressRow(rowID){
        alert("hellow"+rowID);
   }

    _renderRow(rowData, sectionID, rowID){
        return (
            <TouchableOpacity onPress={()=>this._pressRow(rowID)}>
                <View>
                	<Text>{"rowData:"+rowData+"   rowId:"+rowID}</Text>
                </View>
            </TouchableOpacity>
        );
    }
	
		_test(){
			Alert.alert("123");
		}
	
		_test1(){
			Alert.alert("222");
		}
		
		_presschange(){
			
			RNBleManagerModule.test();
//			console.log("1234567");
//			this.setState({dataSource:this.state.dataSource.cloneWithRows(["1","2","3","4"])});
		}
	
		render() {
			return (
				<View style={styles.container}>
					<View style={styles.top}> 
						<Header onPressLeft={this._test.bind(this)} onPressRight={this._test1.bind(this)}/>
		        	</View>
								<ScrollView style={styles.scrollview}>  
		        			<ListView dataSource={this.state.dataSource} renderRow={this._renderRow.bind(this)}/>
		        		</ScrollView>
							<View style={styles.bottom}> 
						<Button buttonType="primaryOutline" onPress={this._presschange.bind(this)}>开始测试1</Button>
					</View>
    		</View>
			);
		}
}

const styles = StyleSheet.create({
  	container: {
    	flex: 1,
    	alignItems: 'center',
    	backgroundColor: '#F5FCFF',
  	},
  	checkbtn:{
  		backgroundColor: '#ff00ff',
  	},
  	top:{
  		height:80,
  	},
  	bottom:{
  		height:80,
  	},
  	row: {  
	   
		},  
		text: {  
		    alignSelf: 'center',  
		    color: '#fff',  
		},  
		scrollview: {  
	    	flex: 1,  
	    	marginBottom:30,
	   	 	borderWidth:1,
	   	 	width:Dimensions.get('window').width,
	    	borderColor:"#000000"
		},  
		page: {  
        flex: 1,  
        height: 130,  
        resizeMode: 'stretch'  
    },
});

module.exports = BleTest;
